<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用户注册</title>
		<link rel="stylesheet" href="css/bootstrap.css" />
		<script type="text/javascript" src="js/jquery-2.0.3.js"></script>
		<style>
			#Registdiv{
				position: absolute;
				width: 400px;
				height:300px;
				background-color: lightgrey;
				top: 50%;
				left: 50%;
				z-index: 1;
				margin-left: -200px;
				margin-top: -150px;
				opacity: 0.9;
				border: solid lightgray;
				border-radius: 25px;
				padding: 10px,10px,10px,10px;
				
			}
			#maindiv{
				position: absolute;
				top:0;
				bottom: 0;
				left: 0;
				right: 0;
				background-image: radial-gradient(#9dbdb3,#37b9e9);
			}
			#Registform{
				
				margin-left: 40px;
				margin-right: 40px;
				
			}

		</style>
	</head>
	<body>
		<div id = "maindiv">
				<div></div>
				<div id="Registdiv" class="row clearfix">
					<div id="Registform">
						<form action="LoginRegistServlet" method="post">
							<div class="input-group" style="margin-top: 35px;">
		  						<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-user" aria-hidden="false"></span></span>
		  						<input type="text" class="form-control" name="username" placeholder="Username" aria-describedby="basic-addon1" required="required">
							</div>
								<div align="right" id="checkusername"></div>
							<div class="input-group" style="margin-top: 10px;">
		  						<span class="input-group-addon" id="basic-addon2"><span class="glyphicon glyphicon-lock" aria-hidden="false"></span></span>
		  						<input type="password" name="password1" id="password1"class="form-control" placeholder="Password" aria-describedby="basic-addon2" required="required">
							</div>
							
							<div class="input-group" style="margin-top: 10px;">
		  						<span class="input-group-addon" id="basic-addon3"><span class="glyphicon glyphicon-lock" aria-hidden="false"></span></span>
		  						<input type="password" name="password2" id="password2" class="form-control" placeholder="RepeatPassword" aria-describedby="basic-addon3" required="required">
							</div>
							<div class="row clearfix" >

								<div class="col-md-6">
									<div class="radio" align="center">
				 						<label><input type="radio" name="power" checked="checked" value="student"/>学生</label>
									</div>
								</div>
								<div class="col-md-6">
									<div class="radio" align="center">
				 						<label><input type="radio" name="power" value="teacher"/>老师</label>
									</div>
								</div>
							</div>
							<input type="hidden" name="op" value="Regist" />
							<div style="margin-top: 10px;">
								 <button type="submit" class="btn btn-default btn-block btn-success">注册</button>
							</div>
						</form>
						<div style="margin-top: 10px;">
							<a href="Login.jsp">返回登录</a>
						</div>
					</div>
				</div>
		</div>
		
		<script>
			$("#password2").blur(function(){
				var password1 = $("#password1").val();
				var password2 = $("#password2").val();
				if(password1 != password2){
					console.log(false);
				}else{
					console.log(true);
				}
			});
		</script>
	</body>
</html>
